@function getRem($pixel) {
  @return $pixel/200*1rem;
}
@function getRemFour($top, $right, $bottom, $left) {
  @return $top/200*1rem $right/200*1rem $bottom/200*1rem $left/200*1rem;
}

//省略号
.ellipsis {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.homeContent {
  width: getRem(750);
  background: #fff;
  margin: getRem(200) 0 0 0;
  .header {
    overflow: hidden;
    margin: getRemFour(20, 0, 0, 20);
    img {
      width: getRem(50);
      display: inline-block;
      border-radius: getRem(50);
    }
    span {
      font-size: getRem(30);
      display: inline-block;
      vertical-align: super;
      margin-left: getRem(20);
      color: #000;
    }
  }
  .themeType {
    width: getRem(750);
    position: fixed;
    z-index: 10;
    top: getRem(81);
    // width: 100%;
    padding: getRem(20) getRem(25);
    background: #fff;
    box-shadow: 0 1px 2px 0 rgba(0,0,0,.05);
    a {
      font-size: getRem(22);
      display: inline-block;
      padding: getRem(10) getRem(15);
      color: #000;
    }
    .active {
      background: #334;
      padding: getRem(5) getRem(10);
      color: #fff;
      border-radius: getRem(10);
    }
  }
  .forumList {
    margin-top: getRem(100);
    .item {
      background: #fff;
      width: 100%;
      padding: getRem(30) getRem(25);
      // margin: getRem(40) auto;
      display: block;
      overflow: hidden;
      border-bottom: 1px solid rgba(178,186,194,.15);
      // box-shadow: 0px 1px 5px 0px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 3px 1px -2px rgba(0, 0, 0, 0.12);
      position: relative;
      // &:nth-last-child(1) {
      //   border: 0;
      // }
      img {
        width: getRem(70);
        height: getRem(70);
        margin-right: getRem(20);
        float: left;
        border-radius: getRem(20);
      }
      aside {
        position: relative;
        left: getRem(10);
        max-height: getRem(140);
        font-size: getRem(32);
        font-weight: 600;
        color: #2e3135;
        display: inline-block;
        width: getRem(530);
      }
      article {
        clear: both;
        width: getRem(600);
        margin-top: getRem(30);
        margin-left: getRem(90);
        section {
          span:nth-of-type(1) {
            background: #f5f5f5;
            font-size: getRem(16);
            color: #FFF;
            padding: getRem(5) getRem(10);
            border-radius: getRem(5);
            width: getRem(100);
            display: inline-block;
            text-align: center;
          }
          span:nth-of-type(2) {
            color: #778087;
            text-decoration: none;
            word-break: break-all;
            margin-left: getRem(15);
          }
        }
      }
      i {
        position: absolute;
        top: getRem(32);
        right: getRem(32);
        background: #aab0c6;
        padding: getRemFour(4, 15, 4, 15);
        border-radius: getRem(12);
        font-weight: 700;
        font-size: getRem(14);
        line-height: getRem(24);
        color: #fff;
        font-style: normal;
      }
    }
  }
  .load {
    text-align: center;
    margin-bottom: getRem(50);
  }
}
